<#include "head_bus.ftl">
<script>
window.onload=function(){
	$("title").html("我的业务-支付密码管理");
}
</script>
<!--内容开始-->
<div class="container">
    <ol class="breadcrumb">
      <li><a href="#">首页</a></li>
      <li><a href="#">个人中心</a></li>
      <li class="active">支付密码管理</li>
    </ol>
    <div class="l-content f18">
       <a href="###" class="icon i-edit i-radius" data-toggle="modal" data-target="#modal-11" data-backdrop="static" data-dismiss="modal"><span>支付密码修改</span></a>
       <a href="###" class="icon icon-9 i-radius" data-toggle="modal" data-target="#modal-1" data-backdrop="static" data-dismiss="modal"><span>支付密码找回</span></a>
    </div>
 
</div>


<!-- 弹出层 -->
<!-- 支付密码修改 -->
<div class="modal fade" id="modal-11">
    <div class="modal-dialog">
        <div class="modal-content">
           <div class="modal-header">
               <a class="close" href="javascript:cancle('modal-11')">×</a>   
               <h4><span>修改</span></h4>
           </div>
           <div class="modal-body text-center way">
                <form class="form-horizontal f15" method="post">
                   <div class="form-group">
                      <label class="col-sm-4 col-xs-4 control-label">账       号：</label>
                      <div class="col-sm-7  col-xs-8">
                         <input type="text" class="form-control" id="payaccount">
                      </div>
                   </div>
                   <div class="form-group">
                      <label class="col-sm-4 col-xs-4 control-label">密       码：</label>
                      <div class="col-sm-5  col-xs-5">
                         <input type="password" class="form-control" id="userpass">
                      </div>
                      <a href="${BASE_PATH}/user/password.htm" class="colR forget">忘记密码>></a>
                   </div>                   
                   <div class="form-group">
                      <label class="col-sm-4 col-xs-4 control-label">验  证  码：</label>
                      <div class="col-sm-4  col-xs-8">
                         <input type="text" class="form-control fl int-code" id="payverify">
                      <a href="javascript:checking('payaccount','getVerify','reGetVerify','1')" id="getVerify" class="btn btn-y code code-5 fr">获取验证码</a>
                      <a href="###" class="btn btn-c code-1 fr d-none" id="reGetVerify">重新发送</a>                         
                      </div>

                   </div>
                   <div class="form-group">
                      <label class="col-sm-4 col-xs-4 control-label">原  密  码：</label>
                      <div class="col-sm-7  col-xs-8">
                         <input type="password" class="form-control" id="upoldpwd"  maxlength="6">
                      </div>
                   </div>
                   <div class="form-group">
                      <label class="col-sm-4 col-xs-4 control-label">支付密码：</label>
                      <div class="col-sm-7  col-xs-8">
                         <input type="password" class="form-control" id="upnewpwd"  maxlength="6">
                      </div>
                   </div>  
                    <div class="form-group">
                      <label class="col-sm-4 col-xs-4 control-label">确认密码：</label>
                      <div class="col-sm-7  col-xs-8">
                         <input type="password" class="form-control" id="uprenewpwd"  maxlength="6">
                      </div>
                   </div>                  
                    <div class="form-group">
                      <div class="text-center">
                          <button type="button" class="btn btn-s btn-120" onclick="upPayPwd()">提交</button>
                          <button type="button" class="btn btn-s btn-120 btn-cyan ml80" onclick="cancle('modal-11')">取消</button>
                      </div>
                  </div>                                
                </form>
           </div>
        </div>
    </div>
</div>
<!-- 支付密码修改成功 -->
<div class="modal fade" id="modal-12">
    <div class="modal-dialog modal-400">
        <div class="modal-content">
           <div class="modal-header">
               <a class="close" data-dismiss="modal">×</a>   
           </div>
           <div class="modal-body text-center">
                <span class="glyphicon glyphicon-ok ok"></span><br/>
                <p class="h4 mt20">支付密码修改成功</p>
           </div>
        </div>
    </div>
</div>
<!-- 密码找回开始-->
<div class="modal fade" id="modal-1">
    <div class="modal-dialog">
        <div class="modal-content">
           <div class="modal-header">
               <a class="close" data-dismiss="modal">×</a>   
               <h4><span>密码找回</span></h4>
           </div>
           <div class="modal-body text-center modal-pad">
               <a href="###" class="icon i-phone" data-toggle="modal" data-target="#modal-13" data-backdrop="static" data-dismiss="modal"><span>手机找回</span></a>
               <a href="###" class="icon i-mail" data-toggle="modal" data-target="#modal-4" data-backdrop="static" data-dismiss="modal"><span>邮箱找回</span></a>
           </div>
        </div>
    </div>
</div>
<!-- 手机找回 -->
<div class="modal fade" id="modal-13">
    <div class="modal-dialog">
        <div class="modal-content">
           <div class="modal-header">
               <a class="close" href="javascript:cancle('modal-13')">×</a>   
               <h4><span>手机找回</span></h4>
           </div>
           <div class="modal-body text-center way">
                <form class="form-horizontal f15" method="post">
                   <div class="form-group">
                      <label class="col-sm-4 col-xs-4 control-label">手  机  号：</label>
                      <div class="col-sm-7  col-xs-8">
                         <input type="text" class="form-control" id="phoneAccount">
                      </div>
                   </div>
                   <div class="form-group">
                      <label class="col-sm-4 col-xs-4 control-label">验  证  码：</label>
                      <div class="col-sm-4  col-xs-8">
                         <input type="text" class="form-control fl int-code " id="phoneVerify">
                       <a href="javascript:checking('phoneAccount','getVerifyPay','reGetVerifyPay','2')" id="getVerifyPay" class="btn btn-y code code-5 fr"]>获取验证码</a>
                      <a href="###" class="btn btn-c code-1 fr d-none" id="reGetVerifyPay">重新发送</a>                        
                      </div>

                   </div>
                   <div class="form-group">
                      <label class="col-sm-4 col-xs-4 control-label">新支付密码：</label>
                      <div class="col-sm-7  col-xs-8">
                         <input type="password" class="form-control" id="phnewpwd"  maxlength="6">
                      </div>
                   </div>
                   <div class="form-group">
                      <label class="col-sm-4 col-xs-4 control-label f14">确认支付密码：</label>
                      <div class="col-sm-7  col-xs-8">
                         <input type="password" class="form-control" id="phrenewpwd"  maxlength="6">
                      </div>
                   </div>  
                    <div class="form-group">
                      <div class="text-center">
                          <button type="button" class="btn btn-s btn-120" onclick="returnPayPwdByPhone()">确认</button>
                          <button type="button" class="btn btn-s btn-120 btn-cyan ml80" onclick="cancle('modal-13')">取消</button>
                      </div>
                  </div>                                
                </form>
           </div>
        </div>
    </div>
</div>
<!-- 手机找回成功 -->
<div class="modal fade" id="modal-14">
    <div class="modal-dialog modal-400">
        <div class="modal-content">
           <div class="modal-header">
               <a class="close" data-dismiss="modal">×</a>   
           </div>
           <div class="modal-body text-center">
                <span class="glyphicon glyphicon-ok ok"></span><br/>
                <p class="h4 mt20">支付密码找回成功</p>
           </div>
        </div>
    </div>
</div>
<!-- 邮箱找回 -->
<div class="modal fade" id="modal-4">
    <div class="modal-dialog modal-516">
        <div class="modal-content">
           <div class="modal-header">
               <a class="close" href="javascript:cancle('modal-4')">×</a>   
               <h4><span>邮箱找回</span></h4>
           </div>
           <div class="modal-body text-center">
                <form action="#" method="post">
                    <p class="tips f13">输入绑定邮箱，发送验证邮件，您的绑定邮箱会接收到一封验证邮件，请在
24小时之内打开邮件内的验证链接完成支付密码修改业务。</p>
                    <div class="form-group">
                        <div class="col-xs-12 fn">
                            <div class="input-group">
                                <span class="input-group-addon input-left">账号绑定邮箱：</span>
                                <input type="text" class="form-control input-220" id="mailaddr">
                            </div>
                        </div>
                    </div>
                     <div class="form-group">
                        <div class="text-center">
                            <button type="button" class="btn btn-s btn-120" onclick="returnPayPwdByMail()">发送</button>
                            <button type="button" class="btn btn-s btn-120 ml80" onclick="cancle('modal-4')">取消</button>
                        </div>
                    </div>               
                </form>
           </div>
        </div>
    </div>
</div>
<!-- 验证邮件成功 -->
<div class="modal fade" id="modal-5">
    <div class="modal-dialog modal-400">
        <div class="modal-content">
           <div class="modal-header">
               <a class="close" data-dismiss="modal">×</a>   
           </div>
           <div class="modal-body text-center">
                <span class="glyphicon glyphicon-ok ok"></span><br/>
                <p class="h4 mt20">验证邮件发送成功</p>
                <p class="f14 col9">请您于24小时内完成验证</p>
           </div>
        </div>
    </div>
</div>
<!-- 验证邮件失败 -->
<div class="modal fade" id="modal-6">
    <div class="modal-dialog modal-400">
        <div class="modal-content">
           <div class="modal-header">
               <a class="close" data-dismiss="modal">×</a>   
           </div>
           <div class="modal-body text-center">
                <span class="glyphicon glyphicon-remove remove"></span><br/>
                <p class="h4 mt20">验证邮件发送失败</p>
                <p class="f14 col9">请重新验证</p>
           </div>
        </div>
    </div>
</div>
<script>
	/**发送验证码**/
		function checking(account,getVerify,reGetVerify,flag){
		    var account=$("#"+account+"").val();
		    //验证手机号
			var array=[[/^[1-9][\d]{10}?$/,account,"手机号不正确，请输入11位手机号"]];
			for(var	 i=0;i<array.length	;i++)
			{
				if(array[i][0].test(array[i][1])==false)
				{
					$("#"+getVerify+"").removeAttr("style");
		    		$("#"+reGetVerify+"").attr("style","display:none");
					alertMsgError("手机发送验证码失败",array[i][2]);
					return;
				}
			}
		    if(''==account){
		    	$("#"+getVerify+"").removeAttr("style");
		    	$("#"+reGetVerify+"").attr("style","display:none");
		    	alertMsgError("手机发送验证码失败","请先输入手机号码,在发送验证码");
		    	return;
		    }
		    var timeSms = getCookieValue("secondsremained");
		    if(timeSms>0){
		    	alert(timeSms+"秒后，请重新获取验证码!");
		    	time('getVerify','reGetVerify');
		    	return;
		    }
		    $.ajax({
		            cache: true,
		            type: "POST",
		            url:"${BASE_PATH}/user/verifyyzm.json",
		            data:{account:account,status:3},
		            async: true,
		            success: function(data){
		               if(data.status==1){//发送成功
				            alertMsgSuccess("手机验证码发送成功",data.info);
				            addCookie("secondsremained",60,60);//添加cookie记录,有效时间60s
						}else if(data.status==2){//发送失败
				            alertMsgError("手机验证码发送失败",data.info);
						}else{
				            alertMsgError("手机验证码发送失败",data.info);
						}
						if(flag==1){
							time(getVerify,reGetVerify);
						}else{
							timePay(getVerify,reGetVerify);
						}
		            }
		     });
		}
		
		
		
		//取消
	function cancle(modal){
		$("#"+modal+"").modal('hide');
		eachInputEmpty(modal);
		window.location.reload();
	}
	
	//支付密码修改
	function upPayPwd(){
		var payaccount=$("#payaccount").val();
		if(''==payaccount){
			alertMsgError("支付密码修改失败","账号不能为空");
			return;
		}
		var userpass=$("#userpass").val();
		if(''==userpass){
			alertMsgError("支付密码修改失败","密码不能为空");
			return;
		}
		var payverify=$("#payverify").val();
		if(''==payverify){
			alertMsgError("支付密码修改失败","验证码不能为空");
			return;
		}
		var upoldpwd=$("#upoldpwd").val();
		if(''==upoldpwd){
			alertMsgError("支付密码修改失败","原支付密码不能为空");
			return;
		}
		var upnewpwd=$("#upnewpwd").val();
		if(''==upnewpwd){
			alertMsgError("支付密码修改失败","新支付密码不能为空");
			return;
		}
		var uprenewpwd=$("#uprenewpwd").val();
		if(''==uprenewpwd){
			alertMsgError("支付密码修改失败","确认密码不能为空");
			return;
		}
		//验证手机号
		var array=[[/^[1-9][\d]{10}?$/,payaccount,"联系电话格式不正确，请输入11位手机号"],[/^[\d]{6}?$/,upnewpwd,"新支付密码格式不正确，请输入6位数字密码"]];
		for(var	 i=0;i<array.length	;i++)
		{
			if(array[i][0].test(array[i][1])==false)
			{
				alertMsgError("支付密码修改失败",array[i][2]);
				return;
			}
		}
		
		$.ajax({
	            cache: true,
	            type: "POST",
	            url:"${BASE_PATH}/user/updatePayPwd.json",
	            dataType : 'json',
	            data:{account:payaccount,userpass:userpass,verify:payverify,upoldpwd:upoldpwd,upnewpwd:upnewpwd,uprenewpwd:uprenewpwd},
	            async: false,
	            success: function(data){
	               if(data){
	               		if(4==data.status){
	               			alertMsgSuccess("支付密码修改成功",data.info);
	               			$('#modal-11').modal('hide');
	               			eachInputEmpty('modal-11');
	               		}else{
	               			alertMsgError("支付密码修改失败",data.info);
	               		}
	               }
	            }
	        });
		
	}
	//手机找回支付密码
	function returnPayPwdByPhone(){
		var phoneAccount=$("#phoneAccount").val();
		if(''==phoneAccount){
			alertMsgError("手机找回支付密码失败","手机号不能为空");
			return;
		}
		var phoneVerify=$("#phoneVerify").val();
		if(''==phoneVerify){
			alertMsgError("手机找回支付密码失败","验证码不能为空");
			return;
		}
		var phnewpwd=$("#phnewpwd").val();
		if(''==phnewpwd){
			alertMsgError("手机找回支付密码失败","新支付密码不能为空");
			return;
		}
		var phrenewpwd=$("#phrenewpwd").val();
		if(''==phrenewpwd){
			alertMsgError("手机找回支付密码失败","确认密码不能为空");
			return;
		}
		
		
		//验证手机号
		var array=[[/^[1-9][\d]{10}?$/,phoneAccount,"联系电话格式不正确，请输入11位手机号"],[/^[\d]{6}?$/,phnewpwd,"新支付密码格式不正确，请输入6位数字密码"]];
		for(var	 i=0;i<array.length	;i++)
		{
			if(array[i][0].test(array[i][1])==false)
			{
				alertMsgError("手机找回支付密码失败",array[i][2]);
				return;
			}
		}
		
		$.ajax({
	            cache: true,
	            type: "POST",
	            url:"${BASE_PATH}/user/returnPayPwdByPhone.json",
	            dataType : 'json',
	            data:{account:phoneAccount,verify:phoneVerify,phnewpwd:phnewpwd,phrenewpwd:phrenewpwd},
	            async: false,
	            success: function(data){
	               if(data){
	               		if(1==data.status){
	               			alertMsgSuccess("手机找回支付密码成功",data.info);
	               			$('#modal-13').modal('hide');
	               			eachInputEmpty('modal-13');
	               		}else{
	               			alertMsgError("手机找回支付密码失败",data.info);
	               		}
	               }
	            }
	        });
	}
	
	
	//邮箱修改密码
	function returnPayPwdByMail(){
		var mailaddr=$("#mailaddr").val();
		if(''==mailaddr){
			alertMsgError("邮箱找回支付密码失败","请填写绑定的邮箱");
			return;
		}
		$.ajax({
	            cache: true,
	            type: "POST",
	            url:"${BASE_PATH}/user/returnPayPwdByMail.json",
	            dataType : 'json',
	            data:{mailaddr:mailaddr},
	            async: false,
	            success: function(data){
	               if(data){
	               		if(2==data.status){
	               			alertMsgSuccess("邮箱找回支付密码成功",data.info);
	               			$('#modal-4').modal('hide');
	               			eachInputEmpty('modal-4');
	               		}else{
	               			alertMsgError("邮箱找回支付密码失败",data.info);
	               		}
	               }
	            }
	        });
	}
	
	/***********************************************工具方法**************************************************/	
	var t=3;
	//失败-错误,弹窗
	function alertMsgError(title,msg){
		$('#modal-6 p').each(function(index){
			if(index==0){
				$(this).html("<font>"+title+"</font>");
			}else{
				$(this).html("<font color=red>"+msg+"</font><br><font id='overTime'></font>");
			}
		})
		$('#modal-6').modal('show');
		overTime(t,'modal-6');
	}
	function cancleClose(modal){
		$("#"+modal+"").modal('hide');
		eachInputEmpty(modal);
	}
	//倒计时
	function overTime(t,modal){
		var str="";
		if(t==0){
			cancleClose(modal);
		}else{
			str="本窗口将在"+t+"秒后自动关闭";
			t--;
			$("#overTime").text("("+str+")");
			setTimeout(function(){
				overTime(t,modal);
			},1000);
		}
	}
	//成功弹窗
	function alertMsgSuccess(title,msg){
		$('#modal-5 p').each(function(index){
			if(index==0){
				$(this).html("<font>"+title+"</font>");
			}else{
				$(this).html("<font>"+msg+"</font><br><font id='overTime'></font>");
			}
		})
		$('#modal-5').modal('show');
		overTime(t,'modal-5');
	}
	//清空input
	function eachInputEmpty(id){
		$("#"+id+" input").each(function(){
			$(this).val("");
		})
	}
</script>
<#include "foot_bus.ftl">